﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
    <link href="~/Content/themes/default/easyui.css" rel="stylesheet" />
    <link href="~/Content/themes/icon.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.8.2.min.js"></script>
    <script src="~/Scripts/jquery.easyui.min.js"></script>
    <script src="~/Scripts/easyui-lang-zh_CN.js"></script>
    <script src="~/Scripts/datapattern.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
    <script src="~/Scripts/MyAjaxForm.js"></script>
    <script>
        $(function () {
            $("#divAdd").css("display", "none");
            $("#editDiv").css("display", "none");
            $("#setActionRole").css("display", "none");
            loadData();
            bindselectActionTypeEnumEvent();
            bindbtnUploadEvent();
        });

        //用户选择菜单权限或者普通权限的时候显示的内容
        function bindselectActionTypeEnumEvent() {
            $("#selectActionTypeEnum").change(function () {
                if ($(this).val() == "0") {
                    $("#trMenuIcon").fadeOut("show");
                } else {
                    $("#trMenuIcon").fadeIn("show");
                }
            });
        }
        //绑定用户上传图标的事件
        function bindbtnUploadEvent() {
            $("#btnUpload").click(function () {
                if ($("#fileUploadImage").val() == "") {
                    $.messager.alert("提示", "请选择上传文件", "error");
                    return;
                }
                //开始上传
                $("#addForm").ajaxSubmit({
                    url: "/ActionInfo/FileUpload",
                    type: "post",
                    success: function (data) {
                        var serverData = data.split(':');
                        if (serverData[0] == "ok") {
                            $("#hidMenuIcon").val(serverData[1]);
                            $("#showImage").append("<img src='" + serverData[1] + "' width='40px' height='40px'/>");
                        } else {
                            $.messager.alert("提示", serverData[1], "error");
                        }
                    }


                });
            });
        }


        //数据展示
        function loadData() {
            $('#tt').datagrid({
                url: '/ActionInfo/GetActionInfo',
                title: '权限数据表格',
                width: 800,
                height: 400,
                fitColumns: true, //列自适应
                nowrap: false,
                idField: 'ID',//主键列的列明
                loadMsg: '正在加载权限的信息...',
                pagination: true,//是否有分页
                singleSelect: false,//是否单行选择
                pageSize: 5,//页大小，一页多少条数据
                pageNumber: 1,//当前页，默认的
                pageList: [5, 10, 15],
                queryParams: {},//往后台传递参数
                columns: [[//c.UserName, c.UserPass, c.Email, c.RegTime
                    { field: 'ck', checkbox: true, align: 'left', width: 50 },
					{ field: 'ID', title: '编号', width: 80 },
					{ field: 'ActionInfoName', title: '权限名称', width: 120 },
                     { field: 'Sort', title: '排序', width: 120 },
                      { field: 'Remark', title: '备注', width: 120 },
                       { field: 'Url', title: '请求地址', width: 120 },
                          { field: 'HttpMethod', title: '请求方式', width: 120 },
                              {
                                  field: 'ActionTypeEnum', title: '权限类型', width: 120,
                                  formatter: function (value, row, index) {
                                      if (value == "1") {
                                          return "菜单权限";
                                      } else {
                                          return "普通权限";
                                      }
                                  }

                              },
					{
					    field: 'SumTime', title: '时间', width: 100, align: 'right',
					    formatter: function (value, row, index) {
					        return (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-M-d");
					    }
					},
                    	{
                    	    field: 'Operator', title: '操作', width: 100, align: 'right',
                    	    formatter: function (value, row, index) {
                    	        var str = "<a href='javascript:void(0)' ids='" + row.ID + "' class='deletes'>删除</a>&nbsp;&nbsp;";
                    	        str = str + "<a href='javascript:void(0)' ids='" + row.ID + "' class='edits'>编辑</a>";
                    	        return str;
                    	    }
                    	}
                ]],
                onLoadSuccess: function (data) {
                    $(".deletes").click(function () {
                        alert($(this).attr("ids"));
                    });
                },
                toolbar: [{
                    id: 'btnDelete',
                    text: '删除',
                    iconCls: 'icon-remove',
                    handler: function () {
                        deleteInfo();
                    }
                }, {
                    id: 'btnAdd',
                    text: '添加',
                    iconCls: 'icon-add',
                    handler: function () {
                        addInfo();
                    }
                }, {
                    id: 'btnEdit',
                    text: '编辑',
                    iconCls: 'icon-edit',
                    handler: function () {
                        editInfo();
                    }
                }, {
                    id: 'btnSetRole',
                    text: '为权限分配角色',
                    iconCls: 'icon-edit',
                    handler: function () {
                        setActionRole();
                    }
                }],
            });
        }

        //添加一个方法
        function addInfo() {
            $("#divAdd").css("display", "block");
            $('#divAdd').dialog({
                title: "添加角色信息",
                collapsible: true,
                width: 300,
                height: 400,
                modal: true,
                resizable: true,
                buttons: [{
                    text: 'Ok',
                    iconCls: 'icon-ok',
                    handler: function () {
                        //提交表单
                        $("#addForm").submit();
                    }
                }, {
                    text: 'Cancel',
                    handler: function () {
                        $('#divAdd').dialog('close');
                    }
                }]
            });

        }

        //添加完成以后调用该方法
        function afterAdd(data) {
            if (data == "ok") {
                $('#divAdd').dialog('close');
                //清空表单中的数据.
                $("#addForm input[type='text']").val("");
            }
        }

        ///删除方法
        function deleteInfo() {
            var rows = $('#tt').datagrid('getSelections');
            //如果没有选中要删除的记录
            if (rows.length == 0 || !rows) {
                $.messager.alert('提醒', '请选择要删除的记录!', 'error');
                return;
            }

            $.messager.confirm('提示', '确定要删除么?', function (r) {
                //r代表了用户点击的操作，TRUE代表了确定，FALSE代表了取消
                if (r) {
                    var strId = '';
                    //将所选中的Id全部都拼接成一个string
                    for (var i = 0; i < rows.length; i++) {
                        strId += rows[i].ID + ',';
                    }
                    strId = strId.substr(0, strId.length - 1);
                    $.post('/ActionInfo/DeleteActionInfo', { "strId": strId }, function (data) {
                        if (data == "ok") {
                            $('#tt').datagrid('clearSelections');
                            $('#tt').datagrid('reload');
                            $.messager.show({
                                title: '提示',
                                msg: '删除成功',
                                showType: 'show'
                            });
                        }
                        else {
                            $.messager.alert("提示", "删除失败", "error");
                        }
                    })
                }
            });
        }

        //修改信息
        function editInfo() {
            var rows = $('#tt').datagrid('getSelections');
            if (rows.length != 1) {
                $.messager.alert("提醒", "必须选中而且只能选中一个!", "error");
                return;
            }
            $("#editFrame").attr("src", "/ActionInfo/ShowEditInfo/?id=" + rows[0].ID);

            $("#editDiv").css("display", "block");
            $('#editDiv').dialog({
                title: "修改信息",
                collapsible: true,
                width: 300,
                height: 400,
                modal: true,
                resizable: true,
                buttons: [{
                    text: 'Ok',
                    iconCls: 'icon-ok',
                    handler: function () {
                        //提交表单
                        //var childWindow = $("#editFrame")[0].contentWindow;//获取子窗体的window对象.
                        //childWindow.subForm();//调用子窗体中的subForm方法.
                    }
                }, {
                    text: 'Cancel',
                    handler: function () {
                        $('#editDiv').dialog('close');
                    }
                }]
            });
        }

        //修改完成以后调用该方法
        function afterEdit(data) {
            if (data == "ok") {
                $('#editDiv').dialog('close');
                $('#tt').datagrid('clearSelections');
                $('#tt').datagrid('reload');
                $.messager.show({
                    title: '提示',
                    msg: '修改成功',
                    showType: 'show'
                });
            } else {
                $.messager.alert("提醒", "修改失败!", "error");
            }

        }

        //给权限分配角色
        function setActionRole() {
            var rows = $('#tt').datagrid('getSelections');
            if (rows.length != 1) {
                $.messager.alert("提醒", "你会分配角色吗!", "error");
                return;
            }
            $("#setActionRoleFrame").attr("src", "/ActionInfo/SetActionRoleInfo/?id=" + rows[0].ID);
            $("#setActionRole").css("display", "block");
            $('#setActionRole').dialog({
                title: "添加角色信息",
                collapsible: true,
                width: 300,
                height: 400,
                modal: true,
                resizable: true,
                buttons: [{
                    text: '修改',
                    iconCls: 'icon-ok',
                    handler: function () {
                        //提交表单
                        var childWindow = $("#setActionRoleFrame")[0].contentWindow;
                        childWindow.subForm();
                    }
                }, {
                    text: '取消',
                    handler: function () {
                        $('#setActionRole').dialog('close');
                    }
                }]
            });

        }

        //分配完成角色以后调用该方法
        function afterSetRoleq(data) {

            $('#setActionRole').dialog('close');


            //$("#setActionRole").css("display", "none");
        }
    </script>
</head>
<body>

    <table id="tt" style="width: 700px;" title="标题，可以使用代码进行初始化，也可以使用这种属性的方式" iconcls="icon-edit"></table>

    <!-------------------------------------------------------添加权限开始-------------------------------------------------------->
    <div id="divAdd">
        @using (Ajax.BeginForm("AddActionInfo", "ActionInfo", new { }, new AjaxOptions() { HttpMethod = "post", OnSuccess = "afterAdd" }, new { id = "addForm" }))
        {
        <table>
            <tr>
                <td>权限名称</td>
                <td>
                    <input type="text" name="ActionInfoName" />
                </td>
            </tr>
            <tr>
                <td>Url</td>
                <td>
                    <input type="text" name="Url" />
                </td>
            </tr>

            <tr>
                <td>HttpMethod</td>
                <td>
                    <select name="HttpMethod">
                        <option value="GET">GET</option>
                        <option value="POST">POST</option>
                    </select>

                </td>
            </tr>


            <tr>
                <td>权限类型</td>
                <td>
                    <select name="ActionTypeEnum" id="selectActionTypeEnum">
                        <option value="0">普通权限</option>
                        <option value="1">菜单权限</option>
                    </select>

                </td>
            </tr>

            <tr style="display:none" id="trMenuIcon">
                <td>菜单图标</td>
                <td>
                    <input type="file" name="fileImage" id="fileUploadImage" />
                    <input type="button" id="btnUpload" value="上传图片" />
                    <input type="hidden" name="MenuIcon" id="hidMenuIcon" />
                    <div id="showImage"></div>

                </td>
            </tr>

            <tr>
                <td>排序</td>
                <td>
                    <input type="text" name="Sort" />
                </td>
            </tr>
            <tr>
                <td>备注</td>
                <td>
                    <input type="text" name="Remark" />
                </td>
            </tr>

        </table>
        }
    </div>
    <!-------------------------------------------------------添加权限结束-------------------------------------------------------->
    <!-------------------------------------------------------修改权限开始-------------------------------------------------------->
    <div id="editDiv" style="overflow:hidden">
        <iframe id="editFrame" scrolling="auto" frameborder="0" width="100%" height="100%"></iframe>
    </div>

    <!-------------------------------------------------------修改权限结束-------------------------------------------------------->
    <!-------------------------------------------------------为权限分配用户开始-------------------------------------------------------->
    <div id="setActionRole">
        <iframe frameborder="0" scrolling="no" width="100%" height="100%" id="setActionRoleFrame"></iframe>
    </div>
    <!-------------------------------------------------------为权限分配用户结束-------------------------------------------------------->


</body>
</html>
